<template>
  <div>
    <div v-if="evalScore.deliveryTypes === deliveryType.JZ">
      <el-divider>检查得分</el-divider>
      <ScoreList :value="jzData" />
    </div>
    <div v-else-if="evalScore.deliveryTypes === deliveryType.MP">
      <el-divider>检查得分</el-divider>
      <ScoreList :value="mpData" />
    </div>
    <div v-else-if="evalScore.deliveryTypes === deliveryType.JZMP">
      <el-divider>检查得分</el-divider>
      <ScoreList :value="jzmpData" />
      <div v-show="jzData.scores.length">
        <div style="width: 110px"><el-divider content-position="left">精装</el-divider></div>
        <ScoreList :value="jzData" />
      </div>
      <div v-show="mpData.scores.length">
        <div style="width: 110px"><el-divider content-position="left">毛坯</el-divider></div>
        <ScoreList :value="mpData" />
      </div>
    </div>
  </div>
</template>
<script>
import { deliveryType } from '@/utils/baseData'
import ScoreDisplay from '@/views/checkScore/chkitemScore/ScoreDisplay'
const itemStyle = { minWidth: '180px', margin: '0 10px 10px 0' }
export default {
  name: 'DeliveryScoreDisplay',
  components: {
    ScoreList: {
      render() {
        return <ScoreDisplay value={this.$attrs.value} cfg={this.$parent.$props.cfg} show-throw-term show-remark item-style={itemStyle} />
      }
    }
  },
  props: {
    value: { type: Object, default: () => ({}) },
    cfg: { type: Object, default: () => ({}) }
  },
  data() {
    return {
      deliveryType,
      evalScore: {},
      jzData: {},
      mpData: {},
      jzmpData: {}
    }
  },
  watch: {
    value: {
      deep: true,
      immediate: true,
      handler() {
        this.initData()
      }
    }
  },
  methods: {
    initData() {
      const evalScore = this.value || {}
      const scores = evalScore.scores || []
      this.jzData = { ...evalScore, scores: scores.filter(i => i.deliveryType === deliveryType.JZ) }
      this.mpData = { ...evalScore, scores: scores.filter(i => i.deliveryType === deliveryType.MP) }
      this.jzmpData = { ...evalScore, scores: scores.filter(i => i.deliveryType === deliveryType.JZMP) }
      this.evalScore = evalScore
    }
  }
}
</script>
